<template>
	<view>
		<view class="header-wapper">
			<view class="header-search">
				<view id="search"></view>
				<view class="search" @click="searchTap">
					<text class="mui-icon mui-icon-search"></text>
					<text>搜索周边美食 / 娱乐</text>
				</view>
			</view>
			<!-- 轮播图 -->
			<v-swiper :list="discoverData.firstList"></v-swiper>
		</view>
		<!-- 功能模块 -->
		<view class="module-list">
			<view class="list-item" v-for="(item,index) in modules" :key="index" @click="moreTap(index+1)">
				<view class="icon">
					<image :src="item.imgSrc" mode=""></image>
				</view>
				<text class="title" v-text="item.title"></text>
			</view>
		</view>
		<!-- 列表 -->
		<view class="mudule-class">
			<more-title title="周边美食" type="cate"></more-title> 
			<view class="list">
				<view v-for="item in discoverData.discoveryList_1" :key="item.disID">
					<model-item :data="item" :location="Location"></model-item>
				</view>
			</view>
			<more-title title="休闲娱乐" type="recreation"></more-title> 
			<view class="list">
				<view v-for="item in discoverData.discoveryList_2" :key="item.disID">
					<model-item :data="item" :location="Location"></model-item>
				</view>
			</view>
			<more-title title="游泳健身" type="fitness"></more-title> 
			<view class="list">
				<view v-for="item in discoverData.discoveryList_3" :key="item.disID">
					<model-item :data="item" :location="Location"></model-item>
				</view>
			</view>
			<more-title title="周边影院" type="movie"></more-title> 
			<view class="list">
				<view v-for="item in discoverData.discoveryList_4" :key="item.disID">
					<model-item :data="item" :location="Location"></model-item>
				</view>
			</view>
		</view>
		<view class="bottom-bow"></view>
	</view>
</template>

<script>
	import { discoverModel } from '../discover.js'
	import vSwiper from '../../../components/discover/swiper.vue'
	import moreTitle from '../../../components/more-title.vue'
	import modelItem from '../../../components/discover/item.vue'
	const Discover = new discoverModel();
	export default {
		components: {
			vSwiper,
			moreTitle,
			modelItem
		},
		data() {
			return {
				Location:{},
				discoverData: {},
				modules: [{
					title: '美食',
					imgSrc: '../../../static/images/discover/meishi.png'
				}, {
					title: '娱乐',
					imgSrc: '../../../static/images/discover/yule.png'
				}, {
					title: '健身',
					imgSrc: '../../../static/images/discover/jianshen.png'
				}, {
					title: '电影',
					imgSrc: '../../../static/images/discover/dianying.png'
				}]
			}
		},
		onLoad() {
			Discover.getLocation()
				.then((res) => {
					this.Location = res
					return Discover.getIndexData(res)
				})
				.then((res) => {
					this.discoverData = res
				})
		},
		onPullDownRefresh() {
			Discover.getIndexData(this.Location)
			 .then((res) => {
				 this.discoverData = res
				 uni.stopPullDownRefresh();
			 })
		}
	}
</script>

<style lang="scss">
	@import '../../../common/scss/discover.scss';
	page {
		background-color: #F7F7F7;
	}  
</style>
